// 导入用来创建路由和确定路由模式的两个方法
import {
    createRouter,
    createWebHistory
} from 'vue-router'
import Login from "@/components/login.vue"
import Main from "@/components/main.vue"
import { nextTick } from 'vue'
/**
 * 定义路由信息
 * 
 */
const routes = [
    {
        name: 'login',
        path: '/login',
        component: Login
    },
    {
        name: '',
        path: '/',
        redirect: "/login"
    },
    {
        name: 'main',
        path: '/main',
        component: Main,
        children:[
            {
            name: 'user',
            path: '/user',
            component:()=>import('@/components/user.vue')
        },
        {
            name: 'operLog',
            path: '/operLog',
            component:()=>import('@/components/OperLog.vue')
        }
    ]
           
    },
    
    
]

// 创建路由实例并传递 `routes` 配置
// 我们在这里使用 html5 的路由模式，url中不带有#，部署项目的时候需要注意。
const router = createRouter({
    history: createWebHistory(),
    routes,
})


// 全局的路由守卫
router.beforeEach((to, from,next) => {
    let userName = sessionStorage.getItem("userName")
    if (to.name !== "login" && !userName) next({ name: 'login',query: { redirect: to.fullPath }})
    else next()
})

// 讲路由实例导出
export default router